@import "template";

/* Filters
---------------------------------------- */

form {
    &.filters {
        width: 100%;
        position:relative;
        overflow:hidden;
        padding-bottom:10px;

        legend {
            color: $default-text-color;
            font-size: 16px;
            margin: $content-padding / 2;
            padding: $content-padding / 2;
            font-weight: bold;
        }

        input, select {
            margin: 6px $content-padding;
            float: right;
            display: block;
            font-size: 14px;
            width: $filter-form-input-width;
            height: 28px;
            border-left: solid 2px #ababab;
            border-top: solid 2px #ababab;
            border-right: solid 1px #ddd;
            border-bottom: solid 1px #ddd;
            border-radius: 5px;
        }

        .checkbox {
            margin-top: 8px;

            input {
                width: auto;
            }
        }

        div {
            float: left;
        }

        label {
            color: $default-text-color;
            display: block;
            float: left;
            font-size: 15px;
            font-weight: bold;
            height: 28px;
            margin: 10px $content-padding;
            padding-left:20px;
            width: $filter-form-label-width - 20px;
        }

        .checkbox label {
            width: auto;
        }

        .buttons {
            margin: 1px 0;
            padding-top: 6px;
            padding-right: $content-padding;
            float: right;

            > button {
                float: left;
                margin: 0 0 0 6px;
            }
        }

        div.error label{
             background: url(../i/warning.png) 0 2px no-repeat;     
        }

        div.remote-start label
        {
             background: url(../i/validate-loading.gif) 0 2px no-repeat;
        } 

        span.validator{   
             margin-top:-3px;  
             padding: 7px 10px 10px 220px;      
             display:block;     
             position:absolute;
             width:$filter-form-input-width;
             >span{
                color:white;
                text-align:left;
                border-radius: 7px;
                border:2px solid #DDD;
                box-shadow: 0 0 6px black;
                padding: 12px;
                display:block;
                font-family: Arial;
                font-weight: bold;
                background: red; 
            }
        }
    }

    &.listing .buttons > button {
        float: left;
        margin: 0 6px 0 0;
    }
}

/* Grid
---------------------------------------- */

.listing {
    background-color: transparent;
    width: auto;
    border: none;
    padding: 0px;
    margin: $content-padding;
}

.grid {
    width: 100%;

}

tbody > tr {
    &:nth-child(even) > td {
        background-color: $grid-even_row-color;
    }

    &:hover > td {
        cursor: pointer;
        background-color: $grid-hover_row-color;
    }
}

.chk {
    width: 18px;
    text-align: center;
}

th > a {
    color: $default-text-color;

    &:visited, &:hover {
        color: $default-text-color;
    }
}

td {
    padding: 3px;
    border: 1px solid $default-text-color;
    text-align: left;
}

th {
    padding: 3px;
    border: 1px solid $default-text-color;
    text-align: left;
    background: $button-background-img;
}

.empty {
    text-align: center;
}

/* Pager
---------------------------------------- */

.pager {
    text-align: right;
    padding: 4px 8px;
    font-size: 12px;
    line-height: 20px;

    > {
        .current, label {
            float: left;
        }
    }
}

.page-size {
    float: left;
}

.pager > label {
    width: auto;
    margin-left: 10px;
}

.page-size {
    width: 45px;
}

.pagination {
    a {
        cursor: pointer;
        border: 1px solid $default-text-color;
        padding: 3px;
        margin: 2px;
    }

    span {
        border: 1px solid $default-text-color;
        padding: 3px;
        margin: 2px;
        cursor: default;
        background: #F9F5DA;
    }
}

.sort_desc a {
    background-image: $sort-arrow-down-img;
    background-size: $sort-arrow-img-size;
    background-repeat: no-repeat;
    padding-left: 20px;
}

.sort_asc a {
    background-image: $sort-arrow-up-img;
    background-size: $sort-arrow-img-size;
    background-repeat: no-repeat;
    padding-left: 20px;
}

/*
Dialogs
---------------------------------------------------*/

#dialog-confirm {
    display: none;
}

.gridrow p {
    padding: 0;
}


#BookCover {
    width: 120px;
    height: 188px;
    border: 1px solid black;
    display: block;
    left: 300px;
    position: fixed;
    top: 200px;
}